<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en" class="h-100">
<head>
    <meta charset="UTF-8">
    <title>跳蚤-登录</title>

    <jsp:include page="common/css.jsp"/>


    <style>
        .fm-signin {
            width: 300px;
            margin: 100px auto;
        }
    </style>
</head>
<body class="d-flex flex-column h-100">
<jsp:include page="common/header.jsp"/>

<div role="main" class="flex-shrink-0">
    <div class="container">
        <form class="fm-signin" id="loginForm" method="post">
            <h1 class="h3 mb-3 font-weight-normal">请先登录</h1>
            <input type="text" name="login" class="form-control" placeholder="Login name" required autofocus>
            <input type="password" name="pwd" class="form-control mt-2" placeholder="Password" required>
            <input type="text" name="checkCode" class="form-control mb-2" placeholder="Check code"> <img id="codeImg"
                                                                                                         src="${ctx}/checkCode"><a
                href="javascript:void(0);" id="changeCode">看不清，换一张</a>
            <input class="btn btn-lg btn-primary btn-block mt-2" type="button" value="登录" onclick="loginSystem();"/>
        </form>
    </div>
</div>


<jsp:include page="common/footer.jsp"/>

<jsp:include page="common/js.jsp"/>
<script type="text/javascript">
    $(function () {
        $('#changeCode').click(function () {
            $('#codeImg').attr('src', ctx + '/checkCode?' + new Date().getTime());
        });
    });

    function loginSystem() {
        $.post(ctx + '/login', $('#loginForm').serialize(), function (data) {
            if (data.success) {
                location.href = ctx + '/user/profile';
            } else {
                alert(data.message);
            }
        });
    }
</script>
</body>
</html>